<template>
    <div>
        <Tabs type="card" :value="paneName" @on-click="clickTabs">
            <TabPane name="1" label="临时医嘱">
                <Tabs type="card" :value="paneName1" @on-click="clickTabs1">
                    <TabPane name="1" label="处置项目">
                        <project-execute-list ref="list1"></project-execute-list>
                    </TabPane>
                    <TabPane name="2" label="处方产品">
                        <product-execute-list ref="list2"></product-execute-list>
                    </TabPane>
                </Tabs>
            </TabPane>
            <TabPane name="2" label="长期医嘱">
                <Tabs type="card" :value="paneName2" @on-click="clickTabs2">
                    <TabPane name="1" label="处置项目">
                        <course-project-execute-list ref="list3"></course-project-execute-list>
                    </TabPane>
                    <TabPane name="2" label="处方产品">
                        <course-product-execute-list ref="list4"></course-product-execute-list>
                    </TabPane>
                </Tabs>
            </TabPane>
            <TabPane name="3" label="家庭病房医嘱">
                <Tabs type="card" :value="paneName3" @on-click="clickTabs3">
                    <TabPane name="1" label="处置项目">
                        <home-project-execute-list ref="list5"></home-project-execute-list>
                    </TabPane>
                    <TabPane name="2" label="处方产品">
                        <home-product-execute-list ref="list6"></home-product-execute-list>
                    </TabPane>
                </Tabs>
            </TabPane>
            <TabPane name="4" label="外科医嘱">
                <surgical-project-execute-list ref="list7"></surgical-project-execute-list>
            </TabPane>
        </Tabs>
    </div>
</template>

<script>
    import iviewTable from '@/view/common/table/Table.vue';
    import iviewPage from '@/view/common/page/Page.vue';
    import ProductExecuteList from '@/view/business/medical/list/MedicalProductExecuteList.vue';
    import ProjectExecuteList from '@/view/business/medical/list/MedicalProjectExecuteList.vue';
    import CourseProjectExecuteList from '@/view/business/medical/list/MedicalCourseProjectExecuteList.vue';
    import CourseProductExecuteList from '@/view/business/medical/list/MedicalCourseProductExecuteList.vue';
    import HomeProjectExecuteList from '@/view/business/medical/list/MedicalHomeProjectExecuteList.vue';
    import HomeProductExecuteList from '@/view/business/medical/list/MedicalHomeProductExecuteList.vue';
    import surgicalProjectExecuteList from '@/view/business/medical/list/TreatPlanSurgicalProjectExecuteList.vue';
    export default {
        components: {
            iviewTable,
            iviewPage,
            ProductExecuteList,
            ProjectExecuteList,
            CourseProjectExecuteList,
            CourseProductExecuteList,
            HomeProjectExecuteList,
            HomeProductExecuteList,
            surgicalProjectExecuteList
        },
        data () {
            return {
                selectRows: [],
                baseURL: '/user/treat/plan/home',
                paneName: '1',
                paneName1: '1',
                paneName2: '1',
                paneName3: '1'
            };
        },
        methods: {
            clickTabs (name) {
                if (name === '1') {
                    this.paneName1 = '1'
                    this.$refs.list1.refresh()
                } else if (name === '2') {
                    this.paneName2 = '1'
                    this.$refs.list3.refresh()
                } else if (name === '3') {
                    this.paneName3 = '1'
                    this.$refs.list5.refresh()
                } else if (name === '4') {
                    this.$refs.list7.refresh()
                }
                this.paneName = name
            },
            clickTabs1 (name) {
                if (name === '1') {
                    this.$refs.list1.refresh()
                } else if (name === '2') {
                    this.$refs.list2.refresh()
                }
                this.paneName1 = name
            },
            clickTabs2 (name) {
                if (name === '1') {
                    this.$refs.list3.refresh()
                } else if (name === '2') {
                    this.$refs.list4.refresh()
                }
            },
            clickTabs3 (name) {
                if (name === '1') {
                    this.$refs.list5.refresh()
                } else if (name === '2') {
                    this.$refs.list6.refresh()
                }
                this.paneName3 = name
            },
            refresh () {
            },
            refreshList1 () {
                this.paneName = '1'
                this.paneName1 = '1'
                this.$refs.list1.refresh();
            },
            init () {

            }
        },
        beforeRouteEnter (to, from, next) {
            next(vm => {
                vm.init()
            })
        },
        beforeRouteLeave (to, from, next) {
            this.$store.state.app.patientName = ''
            this.$store.state.app.medicalNumber = ''
            next()
        }
    }
</script>

<style>

</style>
